package me.fung.wubi.app.view.editor.item

import androidx.compose.foundation.border
import androidx.compose.foundation.layout.*
import androidx.compose.foundation.text.BasicTextField
import androidx.compose.material.MaterialTheme
import androidx.compose.material.Surface
import androidx.compose.material.Text
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.Add
import androidx.compose.material.icons.filled.ArrowBack
import androidx.compose.material.icons.filled.ArrowForward
import androidx.compose.material.icons.filled.Close
import androidx.compose.runtime.*
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp
import me.fung.wubi.app.component.forEachKey
import me.fung.wubi.app.view.editor.EditorView
import me.fung.wubi.app.view.editor.filterWord
import me.fung.wubi.base.define.table.CodeItem
import me.fung.wubi.base.define.value.Word
import me.fung.wubi.base.define.value.WordFrequency


@Composable
fun EditorView.CodeItemComp(rowNumber: Int, codeItem: CodeItem, wordFrequency: WordFrequency?) {
    Row(
        modifier = Modifier,
        verticalAlignment = Alignment.CenterVertically
    ) {
        Text( // 行号
            text = rowNumber.toString(),
            modifier = Modifier.wrapContentSize().widthIn(20.dp, 120.dp),
            color = Color.LightGray
        )

        Text(
            // 编码
            text = codeItem.code.value,
            modifier = Modifier.width(45.dp).padding(start = 5.dp),
            color = Color.LightGray,
        )
        val code = codeItem.code
        codeItem.forEachKey {
            p.filterWord(code, it) { word ->
                word?.also {
                    wordButton( // 词条
                        codeItem,
                        it,
                        wordFrequency?.frequencyOf(it),
                        modifier = Modifier.padding(vertical = 5.dp, horizontal = 10.dp).height(25.dp)
                    )
                }
            }
        }
        addWordButton(codeItem)
    }
}

@Composable
private fun EditorView.addWordButton(item: CodeItem) {
    var value by remember { mutableStateOf("") }
    BasicTextField(
        value = value,
        onValueChange = { value = it },
        modifier = Modifier.widthIn(20.dp, 50.dp).height(25.dp).border(1.dp, Color.LightGray.copy(alpha = 0.3f))
            .wrapContentSize(Alignment.CenterStart),
        singleLine = true,
        textStyle = MaterialTheme.typography.body1.copy(fontSize = 15.sp)
    )
    MiniSaveButton(
        tooltip = "添加'${value}'", onClick = {
            item.add(Word(value))
            value = ""
            p.update()
            p.save()
        }, Icons.Default.Add, enable = value.isNotEmpty()
    )
}

@Composable
private fun EditorView.wordButton(codeItem: CodeItem, word: Word, freq: Int?, modifier: Modifier) = with(codeItem) {
    Surface(modifier = modifier) {
        Row(
            modifier = Modifier.border(1.dp, Color.LightGray.copy(alpha = 0.4f)),
            verticalAlignment = Alignment.CenterVertically
        ) {
            if (word.hasPrevious()) {
                MiniSaveButton("左移", {
                    word.moveToPrevious()
                    p.update()
                    p.save()
                }, Icons.Default.ArrowBack)
            }
            Text(
                word.value,
                modifier = Modifier.padding(start = 3.dp),
                fontSize = MaterialTheme.typography.h6.fontSize,
            )
            if (freq != null) {
                Text(
                    freq.toString(),
                    modifier.offset(y = 5.dp).padding(end = 3.dp),
                    fontSize = 15.sp,
                    color = Color.LightGray,
                )
            }
            MiniSaveButton(
                tooltip = "删除",
                onClick = {
                    remove(word)
                    p.update()
                    p.save()
                },
                image = Icons.Default.Close,
            )
            if (word.hasNext()) {
                MiniSaveButton(
                    tooltip = "右移",
                    onClick = {
                        word.moveToNext()
                        p.update()
                        p.save()
                    },
                    image = Icons.Default.ArrowForward
                )
            }
        }

    }
}